1"use client";
2
3
18import { useEffect } from "react";
19import { useParams, useRouter } from "next/navigation";
20import Link from "next/link";
21import { ShieldCheck } from "lucide-react";
22import { useAuth } from "@/hooks/use-auth";
23import { SsoTabs } from "@/components/admin/SsoTabs";
24import { ScimCard } from "@/components/admin/ScimCard";
25
26export default function SsoAdminIntegrationsPage() {
27 const { orgId } = useParams<{ orgId: string }>();
28 const router = useRouter();
29 const { user, initializing } = useAuth();
30
31 useEffect(() => {
32 if (!initializing && !user) {
33 const next = window.location.pathname + window.location.search;
34 router.replace(`/login?next=${encodeURIComponent(next)}`);
35 }
36 }, [initializing, user, router]);
37
38 if (initializing || !user) {
39 return (
40 <div className="flex min-h-screen items-center justify-center bg-background">
41 <div className="flex items-center gap-3 text-sm text-muted-foreground" role="status">
42 <span className="size-4 animate-spin rounded-full border-2 border-muted-foreground/30 border-t-foreground" />
43 Loading…
44 </div>
45 </div>
46 );
47 }
48
49 return (
50 <div className="min-h-screen bg-background">
51 <header className="border-b border-border">
52 <div className="mx-auto flex max-w-3xl items-center gap-2 px-4 py-3">
53 <Link href="/w/default" className="text-sm text-muted-foreground hover:text-foreground">
54 ← Workspaces
55 </Link>
56 <span className="text-muted-foreground">/</span>
57 <span className="inline-flex items-center gap-1.5 text-sm font-semibold">
58 <ShieldCheck className="size-4" /> Organization admin — Integrations
59 </span>
60 </div>
61 </header>
62 <main className="mx-auto max-w-3xl space-y-8 px-4 py-6">
63 {orgId ? (
64 <>
65 <SsoTabs orgId={orgId} />
66 <ScimCard orgId={orgId} />
67 </>
68 ) : (
69 <p className="text-sm text-muted-foreground">Missing org id.</p>
70 )}
71 </main>
72 </div>
73 );
74}
75